<script setup>
import {ref,defineEmits,defineProps,watch} from "vue";
import selectperson from  "@/views/material/workshop/selectperson.vue";
import request  from '@/api/request'
import { useRouter } from "vue-router"
let router = useRouter();
let emits=defineEmits(["ref-table"])
let props = defineProps({
    data: {
        type: Object,
        default: () => ({})
    }
})
let data = ref()



let Process=ref([]);
let onSubmit=()=>{
     request({
        url: '/workshop/update',
        method: 'put',
        data: {
            ...workshop.value,
                
        }
    }).then(res => {
        emits("ref-table")
    })
       
}


let workshop=ref({
    ...props.data
})


let num1 = ref(1)

const handleChange1 = (value) => {
}
const color1 = ref('#409EFF')



request.post("/system/user/list", {size: 100000}).then(res=>{
    
})

let title = ref("");
let isVisible = ref(false);
let refTanle1 = (a) => {
  isVisible.value = false;
  workshop.value.person= a.value.nickname
};

let select1 = () => {
    title.value = "人员选择";
    isVisible.value = true;
    // router.push("/material/workshop/selectperson");

}
</script>
<template>
    <div>
        <el-card>
            <template #header>
                <el-form :model="workshop" ref="form"  style="padding-left: 70px;" :inline="false"  class="card_wrap">
                    <el-form-item label="车间编码" class="c_item_big">
                        <el-input v-model="workshop.workshopcId" style="width: 350px;" disabled></el-input>
                    </el-form-item>
                    <el-form-item label="车间名称" class="c_item_big">
                        <el-input v-model="workshop.workshopName" style="width: 350px;" ></el-input>
                    </el-form-item>
                     <el-form-item label="面积" class="c_item_big">
                            <el-input-number v-model="workshop.area" :min="1" :max="2000"@change="handleChange1" />
                    </el-form-item>
                    <el-form-item  label="负责人" class="c_item_big">
                               <el-input v-model="workshop.person" style="width: 350px;"></el-input> 
                               <el-button type="primary" size="default"  @click="select1()">选择</el-button>
                               
                    </el-form-item>
                   
                    <el-form-item  label="是否启用" class="c_item_big">
                                <el-radio-group v-model="workshop.isEnabled" @change="">
                                    <el-radio label="是" :value="0">是</el-radio>
                                    <el-radio label="否" :value="1">否</el-radio>
                                </el-radio-group>
                    </el-form-item>

                   <el-form-item label="备注" class="c_item_big">
                        <el-input v-model="workshop.remark" style="width: 350px;" ></el-input>
                    </el-form-item>

                   

                    
                    <el-form-item>
                        <el-button type="primary" @click="onSubmit" class="right-bottom">修改</el-button>
                    </el-form-item>
               
                </el-form>
            </template>
        </el-card>
        <div style="width:800px">
                        <el-dialog :title="title" v-model="isVisible" :destroy-on-close="true" width="60%">
                            <selectperson @ref-table1="refTanle1" :data="data"></selectperson>
                        </el-dialog>
                    </div>
   
        <router-view/>
    </div>
</template>
<style scoped>
.c_item {
    flex: 1;
    margin: 0px 5px 15px 0;
    width: calc((100%-10px)/2);
    min-width: calc((100% - 10px)/2);
    max-width: calc((100% - 10px)/2);

    &:nth-child(3n) {
        margin-right: 0;
    }
}
.c_item_big {
    flex: 2;
    margin: 0px 5px 15px 0;
    width: calc((100%-10px)/1);
    min-width: calc((100% - 10px)/1);
    max-width: calc((100% - 10px)/1);

    &:nth-child(3n) {
        margin-right: 0;
    }
}
.card_wrap {
    width: 98%;
    
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.color {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.right-bottom{
 margin-top: 10px;
 margin-left: 700px ;
}
.right-bottom2{
 margin-top: 20px;
 margin-left: 850px ;
}
</style>